<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>订单管理</title>
    <link rel="stylesheet" href="../../layui-v2.6.8/layui/css/layui.css">
    <script type="text/javascript" src="../../layui-v2.6.8/layui/layui.js"></script>
    <script type="text/javascript" src="../../js/jQuery%20v3.6.0.js"></script>
</head>
<body>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>查询订单信息</legend>
</fieldset>

<form class="layui-form" action="">
    <div class="layui-form-item">
        <div class="layui-inline">
            <div class="layui-inline">
                <label class="layui-form-label" style="font-size: 16px">订单编号：</label>
                <div class="layui-input-block">
                    <input type="text" id="oid" name="title" class="layui-input" style="width: 200px">
                </div>
            </div>
            <button type="button" id="findById" class="layui-btn layui-btn-normal">查询</button>
        </div>
    </div>

    <table class="layui-hide" id="OrderManage" lay-filter="operation"></table>

    </div>
</form>

<script>
    var table = layui.table;

    layui.use(['table'],function () {
        table.render({
            elem: '#OrderManage',
            url: 'http://localhost:8080/searchOrders',
            toolbar: '#toolbarDemo',
            defaultToolbar: ['filter', 'exports', 'print'],
            page: true,
            cols: [[
                {type: 'checkbox', fixed: 'left'}
                , {field: 'oid', title: '订单编号', fixed: 'left', sort: true}
                , {field: 'acontact', title: '寄件人'}
                , {field: 'aphone', title: '寄件人电话'}
                , {field: 'address', title: '寄件人地址'}
                , {field: 'acontact2', title: '收件人'}
                , {field: 'aphone2', title: '收件人电话'}
                , {field: 'address2', title: '收件人地址'}
                , {field: 'kind', title: '货物类别'}
                , {field: 'unitprice', title: '单价'}
                , {field: 'pweight', title: '重量'}
                , {field: 'psum', title: '运费'}
                , {field: 'otime', title: '下单时间'}
                , {field: 'tip', title: '留言'}
            ]],
        });
    })


    $("#findById").click(function () {
        var oid=$('#oid').val()
        if(oid==null||oid==undefined||oid==""){
            alert("请输入要查询的编号");
        }else {
            layer.open({
                area: ['100%', '400px'], //宽高
                title : ["查询结果","align:center"],
                maxmin : false,
                content : '<div><table id="res"></table></div>',
                success: function () {
                    table.render({
                        elem: '#res',
                        url:  'http://localhost:8080/searchOrders/ById?oid='+oid,
                        page: false //关闭分页
                        , cols: [[
                            {field: 'oid', title: '订单编号', sort: true}
                            , {field: 'acontact', title: '寄件人'}
                            , {field: 'aphone', title: '寄件人电话'}
                            , {field: 'address', title: '寄件人地址'}
                            , {field: 'acontact2', title: '收件人'}
                            , {field: 'aphone2', title: '收件人电话'}
                            , {field: 'address2', title: '收件人地址'}
                            , {field: 'kind', title: '货物类别'}
                            , {field: 'unitprice', title: '单价'}
                            , {field: 'pweight', title: '重量'}
                            , {field: 'psum', title: '运费'}
                            , {field: 'otime', title: '下单时间'}
                            , {field: 'tip', title: '留言'}
                        ]]
                    });
                }
            });
        }

    })


</script>
</body>
</html>